<template>
	<view class="swiperSide">
		<view class="uni-padding-wrap">
			<view class="page-section swiper">
				<view class="page-section-spacing">
					<swiper 
						class="swiper" 
						indicator-dots="true" 
						indicator-active-color="#28d4ba" 
						autoplay="true" 
						circular="true"
					>
						<swiper-item v-for="(item,index) in swiperlist" :key="item.id">
							<view class="swiper-item">
								<image class="swiperImg" :src="'http://images.zmzpl.com/'+item.img" ></image>
							</view>
						</swiper-item>
					</swiper>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:'u-swipper',
		props:{
			swiperlist:Array
		},
		data() {
			return {
				
			};
		}
	}
</script>

<style scoped lang="scss">
.swiperSide{
	height: 308rpx;
	position: relative;
	background: url(../../static/index/helfcirindex.png) no-repeat;
	background-size:100%  ;
	.arc{
		width: 100%;
		height: 100%;
	}
	.uni-padding-wrap{
		padding: 0 19rpx;
		width: 100%;
		height: 308rpx;
		// margin-top: 6rpx;
		.page-section-spacing,.page-section,.swiper{
			height: 100%;
		}
	}
	swiper-item {
		margin-top: 6rpx;
		position: relative;
		.swiperImg{
			width: 712rpx;
			height: 302rpx;
			border-radius: 5px;
			}
		.pageNum{
			width: 70rpx;
			height: 34rpx;
			position: absolute;
			right: 30rpx;
			bottom: 13rpx;
			text-align: center;
			background-image: url(../../static/index/pageicon.png);
			background-repeat: no-repeat;
			background-size: 70rpx 34rpx;
			font-weight:400;
			font-size: 20rpx;
			color: rgba(255,255,255,1);
			font-family:SF UI Text;
		}
	}
	
}
</style>
